<%--
  Created by IntelliJ IDEA.
  User: 95126
  Date: 2021/4/29
  Time: 8:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <link rel="stylesheet" href="../imgs/css/bootstrap.min.css">
    <link rel="stylesheet" href="../imgs/css/all.min.css">
    <link rel="stylesheet" href="../imgs/css/animate.css">
    <link rel="stylesheet" href="../imgs/css/flaticon.css">
    <link rel="stylesheet" href="../imgs/css/magnific-popup.css">
    <link rel="stylesheet" href="../imgs/css/odometer.css">
    <link rel="stylesheet" href="../imgs/css/owl.carousel.min.css">
    <link rel="stylesheet" href="../imgs/css/owl.theme.default.min.css">
    <link rel="stylesheet" href="../imgs/css/nice-select.css">
    <link rel="stylesheet" href="../imgs/css/main.css">

    <link rel="shortcut icon" href="../imgs/images/favicon.png" type="image/x-icon">

    <title>Boleto  - Online Ticket Booking Website HTML Template</title>


</head>

<body>
<!-- ==========Preloader========== -->
<div class="preloader">
    <div class="preloader-inner">
        <div class="preloader-icon">
            <span></span>
            <span></span>
        </div>
    </div>
</div>
<!-- ==========Preloader========== -->
<!-- ==========Overlay========== -->
<div class="overlay"></div>
<a href="#0" class="scrollToTop">
    <i class="fas fa-angle-up"></i>
</a>
<!-- ==========Overlay========== -->

<!-- ==========Header-Section========== -->
<%@include file="nav/nav.jsp"%>
<!-- ==========Header-Section========== -->
<!-- ==========Movie-Section========== -->
<section class="movie-section padding-top padding-bottom">
    <div class="container">
        <div class="row flex-wrap-reverse justify-content-center">
            <div class="col-sm-10 col-md-8 col-lg-3">

                <div class="widget-1 widget-check">
                    <div class="widget-header">
                        <h5 class="m-title">我的订单</h5> <a href="#0" class="clear-check"></a>
                    </div>
                </div>
            </div>
            <div class="col-lg-9 mb-50 mb-lg-0">
                <div class="filter-tab tab">
                    <div class="filter-area">
                        <div class="filter-main">
                            <div class="left">
                                <div class="item">
                                    <span class="show">显示 :</span>
                                </div>
                                <div class="item">
                                    <span class="show">排序 :</span>
                                    <select class="select-bar">
                                        <option value="1">升序</option>
                                        <option value="2">降序</option>
                                    </select>
                                </div>
                            </div>
                            <ul class="grid-button tab-menu">
                                <li>
                                    <i class="fas fa-th"></i>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <c:forEach items="${orderList}" var="v">
                        <div class="tab-area">
                            <div class="tab-item active">
                                <div class="movie-area mb-10">
                                    <div class="movie-list">
                                        <div class="movie-thumb c-thumb">
                                            <a href="movie-details.html" class="w-100 bg_img h-100" data-background="../imgs/images/movie/movie01.jpg">
                                                <img class="d-sm-none" src="../imgs/images/movie/movie01.jpg" alt="movie">
                                            </a>
                                        </div>
                                        <div class="movie-content bg-one">
                                            <h5 class="title">
                                                <a href="movie-details.html">${v.movieName}</a>
                                            </h5>
                                            <p class="duration">${v.time}</p>
                                            <div class="movie-tags">
                                                <a href="#0">动作</a>
                                                <a href="#0">冒险</a>
                                                <a href="#0">幻想</a>
                                            </div>
                                            <div class="release">
                                                <span>订单编号 : </span> <a href="#0"> ${v.ordersNo}</a>
                                            </div>
                                            <ul class="movie-rating-percent">
                                                <li>
                                                    <span>总价: </span><span class="content">￥${v.price}</span>
                                                </li>
                                                <li>
                                                    <span>座位: </span><span class="content">${v.seats}</span>
                                                </li>
                                            </ul>
                                            <div class="book-area">
                                                <div class="book-ticket">
                                                    <div class="react-item">
                                                        <a href="#0">
                                                            <div class="thumb">
                                                                <img src="../imgs/images/icons/heart.png" alt="icons">
                                                            </div>
                                                        </a>
                                                    </div>
                                                    <div class="react-item mr-auto">
                                                        <a href="#0">
                                                            <div class="thumb">
                                                                <img src="../imgs/images/icons/book.png" alt="icons">
                                                            </div>
                                                        </a>
                                                    </div>
                                                    <div class="react-item">
                                                        <a href="#0" class="popup-video">
                                                            <button class="custom-button" onclick="showcode(${v.ordersNo})">查看二维码</button>
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </c:forEach>

                </div>
            </div>
        </div>
    </div>
</section>
<!-- ==========Movie-Section========== -->

<!-- ==========Newslater-Section========== -->
<%@include file="footer/footer.jsp"%>
<!-- ==========Newslater-Section========== -->


<script src="../imgs/js/jquery-3.3.1.min.js"></script>
<script src="../imgs/js/modernizr-3.6.0.min.js"></script>
<script src="../imgs/js/plugins.js"></script>
<script src="../imgs/js/bootstrap.min.js"></script>
<script src="../imgs/js/isotope.pkgd.min.js"></script>
<script src="../imgs/js/magnific-popup.min.js"></script>
<script src="../imgs/js/owl.carousel.min.js"></script>
<script src="../imgs/js/wow.min.js"></script>
<script src="../imgs/js/countdown.min.js"></script>
<script src="../imgs/js/odometer.min.js"></script>
<script src="../imgs/js/viewport.jquery.js"></script>
<script src="../imgs/js/nice-select.js"></script>
<script src="../imgs/js/main.js"></script>

<script>
  function showcode(ordersNo){
      window.location="/boot/Qrcode/showcode?ordersNo="+ordersNo;
  }
  $(".select-bar").change(function() {
      let userId=${userId};
      let sort = $(".select-bar option:selected").val();
      window.location="/boot/order/userorder?userId="+userId+"&sort="+sort;
  })

</script>
</body>

</html>
